/**
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements.  See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License.  You may obtain a copy of the License at
*
*      http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

<template>
  <div class="dashboard-container clear">
    <DashboardItem
      v-for="(i, index) in rocketComps.tree[0]
        .children[2].children" :key="index+i.t+i.w+i.d" :index="index"
      :rocketGlobal="rocketGlobal" :i="i" :dragIndex="dragIndex"
      @dragStart="dragStart" />
  </div>
</template>

<script lang="ts">
  import DashboardItem from '@/views/components/dashboard/dashboard-item.vue';
  import Vue from 'vue';
  import { Component } from 'vue-property-decorator';
  import { State } from 'vuex-class';

  @Component({
    components: {
      DashboardItem,
    },
  })
  export default class InstancesSurvey extends Vue {
    @State('rocketbot') private rocketGlobal: any;
    @State('rocketOption') private stateDashboardOption!: any;
    @State('rocketData') private rocketComps!: any;

    private dragIndex: number = NaN;


    public dragStart(index: number) {
      this.dragIndex = index;
    }
  }
</script>

<style lang="less" scoped>

</style>
